<template>
    <view>
      
    <button @click="change">点击切换</button>
    <div class="company-easydamage" >
            <transition enter-active-class="animated fadeInUp" leave-active-class="animated fadeOutDown">
                <div v-if="show" class="easydamageBox" >
                    <button @click="hide" class="hide" >点击隐藏</button>
                    <ul>
                        <li>aaaaaaaaaaaaaa</li>                        
                    </ul>
                </div>
            </transition>
    </div>

</view>
</template>

<script>
/* 
http://192.168.1.27:8080/#/pages/test/test
*/
export default {
   data(){
    return{
      show:true
    }
  },methods:{
    change(){
      this.show=!this.show;
    },
    hide(){
      this.show=!this.show;
    }
  },
    // 捕获 app error
   onError (err) {
       console.log(err)
   }
}
</script>

<style>
.company-easydamage {
   position: fixed;
   bottom: 0px;
   overflow: hidden;
}

.easydamageBox {
    border: 1px solid #ccc;
    width: 100vw;
    height: 60vh;    
}

.hide {
    width: 100px;
    margin-left: 75%;
    margin-top: 5px;
}

.easydamageBox ul {
   margin: 10px;
    height: 90%;
    overflow: auto;
    margin-bottom: 10%;
}
</style>
